<template>
	<view class="mobile">
		<zui-watermark :content="watermarkText" invert color="#666" blend="difference" :opacity="0.15" :cellWidth="180" :cellHeight="120" />
		<view class="nav-style" :style="{ height: navHeight + 'px', 'padding-top': 15 + 'px', lineHeight: navHeight + 'px', fontWeight: 600, fontSize: 18 + 'px' }">掌上艾防</view>

		<view class="content" :style="{ marginTop: navHeight + 'px' }">
			<view class="type">
				<view class="hiv">
					<image src="/static/image/hiv.png" mode="aspectFit"></image>
				</view>
				<view class="text">性伴溯源</view>
			</view>
			<view class="gridbox">
				<view class="one" @click="ToSeed">
					<view class="logo">
						<image src="/static/image/seed.png" mode="aspectFit"></image>
					</view>
					<view class="title">志愿者</view>
				</view>
				<view class="one" @click="ToSex">
					<view class="logo">
						<image src="/static/image/sex.png" mode="aspectFit"></image>
					</view>
					<view class="title">性伴检测</view>
				</view>
				<view class="one" @click="Tolingqu">
					<view class="logo">
						<image src="https://yun.shlxkj.info:44300/%E8%89%BE%E7%91%9E%E6%B5%8B/%E5%B0%8F%E7%A8%8B%E5%BA%8F/static/image/lingqushiji.png" mode="aspectFit"></image>
					</view>
					<view class="title">设备领取</view>
				</view>
			</view>

<!--  -->
			<view class="type"  v-if="this.Nanchang">
				<view class="hiv">
					<image src="/static/image/hiv.png" mode="aspectFit"></image>
				</view>
				<view class="text">商业性性伴检测</view>
			</view>
			<view class="gridbox"  v-if="this.Nanchang">
				<view class="one" @click="To_Volunteer">
					<view class="logo">
						<image src="/static/image/seed.png" mode="aspectFit"></image>
					</view>
					<view class="title">志愿者</view>
				</view>
				<view class="one" @click="ToVolunSex">
					<view class="logo">
						<image src="/static/image/sex.png" mode="aspectFit"></image>
					</view>
					<view class="title">性伴检测</view>
				</view>
			</view>

			<!-- <view class="type">
				<view class="hiv">
					<image src="/static/image/hiv.png" mode="aspectFit"></image>
				</view>
				<view class="text">外展活动</view>
			</view>
			<view class="gridbox">
				<view class="one" @click="ToApplication">
					<view class="logo">
						<image src="/static/image/create.png" mode="aspectFit"></image>
					</view>
					<view class="title">外展创建</view>
				</view>
				<view class="one" @click="ToList">
					<view class="logo">
						<image src="/static/image/list.png" mode="aspectFit"></image>
					</view>
					<view class="title">外展列表</view>
				</view>
				<view class="one" @click="ToClaim">
					<view class="logo">
						<image src="/static/image/message.png" mode="aspectFit"></image>
					</view>
					<view class="title">作废项目</view>
				</view>
			</view> -->

			<view class="type">
				<view class="hiv">
					<image src="/static/image/hiv.png" mode="aspectFit"></image>
				</view>
				<view class="text">库存管理</view>
			</view>
			<view class="gridbox">
				<view class="one" @click="ToManage">
					<view class="logo">
						<image src="/static/image/manage.png" mode="aspectFit"></image>
					</view>
					<view class="title">库存管理</view>
				</view>
				<view class="one" @click="ToOutbound">
					<view class="logo">
						<image src="/static/image/storage.png" mode="aspectFit"></image>
					</view>
					<view class="title">入库扫码</view>
				</view>
			</view>

			<view class="type">
				<view class="hiv">
					<image src="/static/image/hiv.png" mode="aspectFit"></image>
				</view>
				<view class="text">其它</view>
			</view>
			<view class="gridbox">
				<!-- <view class="one" @click="ToArrow">
					<view class="logo">
						<image src="/static/image/arrow.png" mode="aspectFit"></image>
					</view>
					<view class="title">项目打卡</view>
				</view>
				<view class="one" @click="ToSum">
					<view class="logo">
						<image src="/static/image/summary.png" mode="aspectFit"></image>
					</view>
					<view class="title">项目总结</view>
				</view>
				<view class="one" @click="ToClaim">
					<view class="logo">
						<image src="/static/image/shenling.png" mode="aspectFit"></image>
					</view>
					<view class="title">检测登记</view>
				</view>
				<view class="one" @click="ToAllots">
					<view class="logo">
						<image src="/static/image/lianluo.png" mode="aspectFit"></image>
					</view>
					<view class="title">意愿统计</view>
				</view> -->
				<view class="one" @click="ToUse">
					<view class="logo">
						<image src="/static/image/use.png" mode="aspectFit"></image>
					</view>
					<view class="title">代为检测</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
import { FindLoginUser, GetNoteList } from '../../utils/api.js';
export default {
	data() {
		return {
			noteNum: '',
			watermarkText: '',
			Nanchang:false
		};
	},
	onShow() {
		// this.FindLoginUser()
		this.$store.commit('$uStore', {
			name: 'wenjuan_show',
			value: false
		});
	},
	methods: {
		// 获取当前账号信息
		async FindLoginUser() {
			const res = await FindLoginUser();
			if(res.data.cdc==3){
				this.Nanchang =true
			}
			// this.GetNoteList(res.data.userid)
			this.watermarkText = res.data.admininfo.name;
		},
		GetNoteList(id) {
			GetNoteList(id)
				.then((res) => {
					this.noteNum = res.TotalCount;
					console.log(res);
				})
				.catch((err) => {
					console.log(err);
				});
		},
		ToVolunSex(){
			uni.navigateTo({
				url: '/page-defense/Commercial_Sex/Commercial_Sex'
			});
		},
		ToSeed() {
			uni.navigateTo({
				url: '/page-defense/seed/seed'
			});
		},
		ToSex() {
			uni.navigateTo({
				url: '/page-defense/sex/sex'
			});
		},
		ToManage() {
			uni.navigateTo({
				url: '/page-defense/manage/manage'
			});
		},
		ToClaim() {
			uni.navigateTo({
				url: '/pages/claim/claim'
			});
		},
		ToIntention() {
			uni.navigateTo({
				url: '/pages/intention/intention'
			});
		},
		ToOutbound() {
			uni.navigateTo({
				url: '/page-defense/storage/storage'
			});
		},
		ToRegister() {
			uni.navigateTo({
				url: '/pages/register/register'
			});
		},
		ToApplication() {
			uni.navigateTo({
				url: '/pages/application/application'
			});
		},
		ToSum() {
			uni.navigateTo({
				url: '/pages/huodonghuibao/huodonghuibao'
			});
		},
		ToAllots() {
			uni.navigateTo({
				url: '/pages/allots/allots'
			});
		},
		ToMessage() {
			uni.navigateTo({
				url: '/pages/message/message'
			});
		},
		ToUse() {
			uni.navigateTo({
				// url: '/pages/use/use'
				url: '/page-defense/home/index'
			});
		},
		ToArrow() {
			uni.navigateTo({
				url: '/pages/arrow/arrow'
			});
		},
		ToList() {
			uni.navigateTo({
				url: '/pages/list/list'
			});
		},
		To_Volunteer() {
			uni.navigateTo({
				url: '/page-defense/Commercial_Volunteer/Commercial_Volunteer'
			})
		},
		Tolingqu(){
			uni.navigateTo({
				url: '/page-defense/lingqushebei/lingqushebei'
			})
		}
	},
	onLoad() {
		//获取手机系统的信息（在这主要是获取状态栏和胶囊的高度）
		uni.getSystemInfo({
			success: (e) => {
				// this.compareVersion(e.SDKVersion, '2.5.0')
				let statusBar = 0;
				let customBar = 0;

				// #ifdef MP
				statusBar = e.statusBarHeight;
				customBar = e.statusBarHeight + 45;
				if (e.platform === 'android') {
					// this.$store.commit('SET_SYSTEM_IOSANDROID', false)
					customBar = e.statusBarHeight + 50;
				}
				// #endif

				// #ifdef MP-WEIXIN
				statusBar = e.statusBarHeight;
				// @ts-ignore
				const custom = wx.getMenuButtonBoundingClientRect();
				customBar = custom.bottom + custom.top - e.statusBarHeight;
				// #endif

				// #ifdef APP-PLUS
				// console.log('app-plus', e)
				statusBar = e.statusBarHeight;
				customBar = e.statusBarHeight + 45;
				// #endif

				// #ifdef H5
				statusBar = 0;
				customBar = e.statusBarHeight + 45;
				// #endif

				// 这里你可以自己决定存放方式，建议放在store中，因为store是实时变化的
				this.statusBarHeight = statusBar;
				this.navHeight = customBar;
			}
		});
		this.FindLoginUser();
	}
};
</script>

<style lang="scss" scoped>
.mobile {
	width: 100%;
	height: 100vh;
	position: relative;
	background-image: url('https://www.shlxkj.info:10010/%E5%81%A5%E5%BA%B7%E6%A1%A3%E6%A1%88/zsafimg/bgimg.png');
	background-size: cover;
	background-repeat: no-repeat;
	overflow: hidden;
	box-sizing: border-box;

	.nav-style {
		position: fixed;
		// background-color: #2E7CFD;
		top: 0;
		right: 0;
		left: 0;
		z-index: 1000;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.content {
		padding: 0 30rpx;
		background: #f4f6f8;
		height: 100vh;
		overflow: hidden;
		box-sizing: border-box;

		.type {
			width: 100%;
			margin: 30rpx 0;
			display: flex;
			align-items: center;
			.hiv {
				width: 32rpx;
				height: 32rpx;
				image {
					width: 100%;
					height: 100%;
				}
			}
			.text {
				margin-left: 10rpx;
			}
		}

		.gridbox {
			width: 100%;
			background-color: #fff;
			border-radius: 12rpx 12rpx 12rpx 12rpx;
			display: flex;
			flex-wrap: wrap;
			align-items: center;
			padding: 30rpx 10rpx 0;
			box-sizing: border-box;
			.one {
				width: 25%;
				margin-bottom: 30rpx;
				.logo {
					margin: 0 auto;
					width: 78rpx;
					height: 78rpx;
					image {
						width: 100%;
						height: 100%;
					}
				}
				.title {
					margin-top: 10rpx;
					width: 100%;
					text-align: center;
					font-weight: 400;
					font-size: 27rpx;
					color: #555555;
					line-height: 32rpx;
				}
			}
		}
	}
}

.grid-item-box {
	// flex: 1;
	// position: relative;
	/* #ifndef APP-NVUE */
	display: flex;
	/* #endif */
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 20rpx 0;
}

.grid-item-box-row {
	flex: 1;
	// position: relative;
	/* #ifndef APP-NVUE */
	display: flex;
	/* #endif */
	flex-direction: row;
	align-items: center;
	justify-content: center;
	padding: 20rpx 0;
}

.grid-dot {
	position: absolute;
	top: 5px;
	right: 15px;
}

.img {
	width: 130rpx;
	height: 130rpx;
	margin-bottom: 10rpx;
}
</style>
